<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<meta name="format-detection" content="telephone=no">
	<meta name="author" content="演示SHOP Team">
	<meta name="copyright" content="演示SHOP">
	<title>${message("member.password.edit")}[#if showPowered] - 演示电商[/#if]</title>
	<link href="${base}/favicon.ico" rel="icon">
	<link href="${base}/resources/common/css/bootstrap.css" rel="stylesheet">
	<link href="${base}/resources/common/css/font-awesome.css" rel="stylesheet">
	<link href="${base}/resources/common/css/iconfont.css" rel="stylesheet">
	<link href="${base}/resources/common/css/base.css" rel="stylesheet">
	<link href="${base}/resources/mobile/member/css/base.css" rel="stylesheet">
	<!--[if lt IE 9]>
		<script src="${base}/resources/common/js/html5shiv.js"></script>
		<script src="${base}/resources/common/js/respond.js"></script>
	<![endif]-->
	<script src="${base}/resources/common/js/jquery.js"></script>
	<script src="${base}/resources/common/js/bootstrap.js"></script>
	<script src="${base}/resources/common/js/bootstrap-growl.js"></script>
	<script src="${base}/resources/common/js/jquery.scrolltofixed.js"></script>
	<script src="${base}/resources/common/js/jquery.validate.js"></script>
	<script src="${base}/resources/common/js/jquery.validate.additional.js"></script>
	<script src="${base}/resources/common/js/jquery.form.js"></script>
	<script src="${base}/resources/common/js/jquery.cookie.js"></script>
	<script src="${base}/resources/common/js/underscore.js"></script>
	<script src="${base}/resources/common/js/url.js"></script>
	<script src="${base}/resources/common/js/base.js"></script>
	<script src="${base}/resources/mobile/member/js/base.js"></script>
	[#noautoesc]
		[#escape x as x?js_string]
			<script>
			$().ready(function() {
				
				var IntervalCount = 120;//验证码有效时间
				var $inputForm = $("#inputForm");
				var $getSmsCode = $("[data-action='getSmsCode']");
				var $smsCode=$("#smsCode");
				// 获取手机验证码
				var countdowns;
				var count=IntervalCount;
				$getSmsCode.click(function() {
					count=IntervalCount;
					$getSmsCode.attr("disabled", true);

					$.ajax({
						url: "${base}/member/password/getSmsCode",
						type: "GET",
						dataType: "json",
						cache: false,
						success: function(data) {
							var code=data.code;
							if(code!==200){
								$getSmsCode.attr("disabled", false);
								$.bootstrapGrowl(data.message,{type: "warning"});
							}else{
								$.bootstrapGrowl(data.message);
								countdowns = setInterval(CountDown, 1000);
							}
						}
					});
				});
				var localCountdowns=localStorage.countdown;
				if(localCountdowns>0){
					$getSmsCode.attr("disabled", true);
					count=localCountdowns;
					countdowns = setInterval(CountDown, 1000);
				}
				function CountDown() {
					$getSmsCode.attr("disabled", true);
					$getSmsCode.text(" "+count+"s ");
					localStorage.setItem("countdown",count);
					if (count <= 0) {
						clearInterval(countdowns);
						$getSmsCode.text('${message("member.login.getCaptcha")}')
						$getSmsCode.removeAttr("disabled");
						localStorage.removeItem("countdown");
						return false;
					}else{
						count--;
					}
				}
				// 表单验证
				$inputForm.validate({
					rules: {
						[#--currentPassword: {--]
							[#--required: true,--]
							[#--remote: {--]
								[#--url: "${base}/member/password/check_current_password",--]
								[#--cache: false--]
							[#--},--]
							[#--normalizer: function(value) {--]
								[#--return value;--]
							[#--}--]
						[#--},--]
						password: {
							required: true,
							minlength: 4,
							normalizer: function(value) {
								return value;
							}
						},
						rePassword: {
							required: true,
							equalTo: "#password",
							normalizer: function(value) {
								return value;
							}
						},
						smsCode: "required"
					},
					submitHandler: function(form) {
						var smsCode=$smsCode.val();
						$.ajax({
							url: "${base}/member/password/checkSmsCode?smsCode="+smsCode,
							type: "POST",
							dataType: "json",
							cache: false,
							success: function(data) {
								var code=data.code;
								if(code!==200){
									$getSmsCode.attr("disabled", false);
									$.bootstrapGrowl(data.message,{type: "warning"});
								}else{
									$(form).ajaxSubmit({
										successMessage: false,
										successRedirectUrl: function(redirectUrlParameterName) {
											clearInterval(countdowns);
											localStorage.removeItem("countdown");
											$.bootstrapGrowl("密码修改成功.")
											[#--return  "${base}/member/password/edit";--]
										}
									});
								}
							}
						});

					}
				});
			
			});
			</script>
		[/#escape]
	[/#noautoesc]
</head>
<body class="member">
	<header class="header-default" data-spy="scrollToFixed">
		<div class="container-fluid">
			<div class="row">
				<div class="col-xs-1">
					<a href="${base}/member/index">
						<i class="iconfont icon-back"></i>
					</a>
				</div>
				<div class="col-xs-10">
					<h5>${message("member.password.edit")}</h5>
				</div>
			</div>
		</div>
	</header>
	<main>
		<div class="container-fluid">
			<form id="inputForm" class="ajax-form" action="${base}/member/password/update" method="post">
				<div class="panel panel-default">
					<div class="panel-body">
						[#--<div class="form-group">--]
							[#--<label class="item-required" for="currentPassword">${message("member.password.currentPassword")}</label>--]
							[#--<input id="currentPassword" name="currentPassword" class="form-control" type="password" maxlength="200" autocomplete="off">--]
						[#--</div>--]
						<div class="form-group">
							<label class="item-required" for="password">${message("member.password.newPassword")}</label>
							<input id="password" name="password" class="form-control" type="password" maxlength="20" autocomplete="off">
						</div>
						<div class="form-group">
							<label class="item-required" for="rePassword">${message("member.password.rePassword")}</label>
							<input id="rePassword" name="rePassword" class="form-control" type="password" maxlength="20" autocomplete="off">
						</div>

						<div class="form-group" style="margin-bottom: 30px;">
							<label class="item-required" for="rePassword">${message("common.sms.name")}</label>
							<div class="input-group">
								<input id="smsCode" name="smsCode" class="captcha form-control"  style="height: 41px;" type="text" maxlength="6"  autocomplete="off">
								<span class="input-group-btn" >
							<button class="btn btn-xs" style="min-width: 72px;height: 41px;border-color: #108ee9;background-color: #108ee9;color: #ffffff" type="button" data-action="getSmsCode">${message("member.login.getCaptcha")}</button>
						</span>
							</div>
						</div>

					</div>
					<div class="panel-footer text-center">
						<button class="btn btn-primary" type="submit">${message("common.submit")}</button>
						<a class="btn btn-default" href="${base}/member/index">${message("common.back")}</a>
					</div>
				</div>
			</form>
		</div>
	</main>
</body>
</html>